<!DOCTYPE html>
<html lang="en" xmlns:th="http://thyneleaf.org">
<head>
    <meta charset="UTF-8">
</head>
<body>
<div th:replace="/common/header"></div>
<div id="Content">
<div id="BackLink">
    <a th:href="${'/category/ViewProduct?productId='}+${product.productId}">Return to <th:block th:text="${product.productId}" /></a> </div>


<div id="Catalog">

    <style type="text/css">

        table {
            width: 700px;
            padding: 0;
            margin: 0;
        }

        caption {
            padding: 0 0 5px 0;
            width: 700px;
            font: italic 16px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
            text-align: right;
        }

        th {
            font: bold 20px "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
            color: #f5ba11;
            border-right: 1px solid #bfa986;
            border-bottom: 1px solid #bfa986;
            border-top: 1px solid #bfa986;
            letter-spacing: 2px;
            text-transform: uppercase;
            text-align: left;
            padding: 6px 6px 6px 12px;
            background: #eee0c5 no-repeat;
        }

        td {
            border-right: 1px solid #bfa986;
            border-bottom: 1px solid #bfa986;
            background: #fff;
            font-size:16px;
            padding: 6px 6px 6px 12px;
            color: #4f6b72;
        }


    </style>
    <table>
        <tr>
            <td><th:block th:utext="${product.descn}" />
            </td>
        </tr>
        <tr>
            <td><b><th:block th:text="${item.itemId}" />
               </b></td>
        </tr>
        <tr>
            <td><b><font size="4"><th:block th:text="|${item.attribute1},${product.name}|" />
            </font></b> <button class="wishlist" type="button" data-toggle="tooltip" title="Add to Wish List">
                <a th:href="${'/account/insertWish?Itemid='}+${item.itemId}">
                    <i class="fa fa-heart"></i></a></button>
            </td>
        </tr>
        <tr>
            <td><th:block th:text="${product.name}" />
              </td>
        </tr>
        <tr>
            <td th:if="${item.quantity <= 0}">
                Back ordered.
           </td>
            <td th:if="${item.quantity > 0}">
                <th:block th:text="${item.quantity}"/>  in stock.
            </td>
        </tr>
        <tr>
            <td><th:block th:text="${item.listPrice}" />
               </td>
        </tr>

        <tr>
            <td>
                <a th:if="${instock} eq 'true' "th:href="${'/cart/AddItemtoCart?workingItemId='}+${item.itemId}" class="Button">Add to Cart</a></td>
        </tr>
        <tr th:if="${instock} eq 'false' "><h2 style="
               border-right: 2px solid #eee0c5;
               border-bottom: 2px solid #eee0c5;">提示:</h2><a href="#" style="font-size: 20px">  亲~ 商品已经下架了,商家正努力补货中</a></tr>
    </table>

</div>
</div>
<div th:replace="/common/footer"></div>
</body>
</html>